<!DOCTYPE html>
<html>
<head>
    <title>阅读管理</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <meta name="description" content="木兰湾管理系统">
    <script type="text/javascript" src="../../static/include/header-css.js"></script>
    <script type="text/javascript">

    </script>
</head>
<body>
<div class="weui-search-bar" id="searchBar">
    <form class="weui-search-bar__form" id="search-form">
        <div class="weui-search-bar__box">
            <i class="weui-icon-search"></i>
            <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="搜索" name="name" required="" >
            <a href="javascript:searchData();" class="weui-icon-clear" id="searchClear"></a>
        </div>
        <label class="weui-search-bar__label" id="searchText">
            <i class="weui-icon-search"></i>
            <span>搜索</span>
        </label>
        <input type="hidden" name='page' value="1" id="page"/>
    </form>
    <a href="javascript:searchData()" class="mulanbay-search-btn" id="searchData">搜索</a>
</div>
<!--列表数据显示-->
<div id="dataContent"></div>
<!--滚动加载-->
<div class="weui-loadmore" id="loadingSpan">
    <span class="weui-loadmore__tips">加载中...</span>
</div>
<!--编辑页面-->
<div id="edit-popup" class='weui-popup__container'>
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal">
        <div class="toolbar">
            <div class="toolbar-inner">
                <a href="javascript:;" class="picker-button close-popup">关闭</a>
                <h1 class="title">书籍信息</h1>
            </div>
        </div>
        <div class="modal-content">
            <div class="white_bg">
                <form id="edit-form">
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">书名<span class="mulanbay-notNull">*</span></label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="text" placeholder="" name="bookName">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">作者<span class="mulanbay-notNull">*</span></label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="text" placeholder="" name="author">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">出版社<span class="mulanbay-notNull">*</span></label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="text" placeholder="" name="press">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">ISBN<span class="mulanbay-notNull">*</span></label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="text" placeholder="" name="isbn">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">国家<span class="mulanbay-notNull">*</span></label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="text" placeholder="" name="nation">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd"><label class="weui-label">图书分类<span class="mulanbay-notNull">*</span></label></div>
                        <div class="weui-cell__bd">
                            <div id="bookCategoryList"></div>
                        </div>
                        <div class="weui-cell__hd">
                            <a href="javascript:showInfoMsg('未实现');"><img src="../../static/image/add.png" alt="说明"></img></a>
                        </div>
                    </div>
                    <div class="weui-cells__title" align="center"><<<--更多选项-->>></div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">评分</label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="text" name="score" placeholder="值范围：0.0-10.0">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">语言</label>
                        </div>
                        <div class="weui-cell__bd">
                            <select class="weui-input" name="language">
                                <option value="CHINESE">中文</option>
                                <option value="ENGLISH">英文</option>
                            </select>
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">出版年份</label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="number" name="publishedYear" placeholder="">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">借入/购买日期</label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" id='storeDate' name="storeDate" type="text" value="">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">期望完成日期</label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" id='proposedDate' name="proposedDate" type="text" value="">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">开始日期</label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" id='beginDate' name="beginDate" type="text" value="">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">完成日期</label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" id='finishedDate' name="finishedDate" type="text" value="">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">状态</label>
                        </div>
                        <div class="weui-cell__bd">
                            <select class="weui-input" name="status">
                                <option value="UNREAD">未读</option>
                                <option value="READING">正在读</option>
                                <option value="READED">已读</option>
                                <option value="GIVEUP">放弃</option>
                            </select>
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">书籍类型</label>
                        </div>
                        <div class="weui-cell__bd">
                            <select class="weui-input" name="bookType">
                                <option value="PAPER">纸质书</option>
                                <option value="EBOOK">电子书</option>
                            </select>
                        </div>
                    </div>
                    <div class="weui-cells__title"><span class='mulanbay_textarea_title'>备注</span></div>
                    <div class="weui-cells weui-cells_form">
                        <div class="weui-cell">
                            <div class="weui-cell__bd">
                                <textarea class="weui-textarea" placeholder="" rows="3" name="remark"></textarea>
                                <div class="weui-textarea-counter"><span>0</span>/200</div>
                            </div>
                        </div>
                    </div>
                    <input type="text" style="display:none;" name='id' id="id" value=""/>
                </form>
            </div>
            <br>
            <br>
            <a href="javascript:saveData();" class="weui-btn weui-btn_primary weui-footer_fixed-bottom"><label id="edit-button-name">保存</label></a>
        </div>
    </div>
</div>

<!--阅读记录编辑页面-->
<div id="edit-readingRecordDetail-popup" class='weui-popup__container popup-bottom'>
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal">
        <div class="toolbar">
            <div class="toolbar-inner">
                <a href="javascript:;" class="picker-button close-popup">关闭</a>
                <h1 class="title">阅读详情</h1>
            </div>
        </div>
        <div class="modal-content">
            <div class="white_bg">
                <form id="edit-readingRecordDetail-form">
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd"><label class="weui-label">阅读时间<span class="mulanbay-notNull">*</span></label></div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" id='readTime' name="readTime" type="text" value="">
                        </div>
                    </div>
                    <div class="weui-cell mulanbay_select-before">
                        <div class="weui-cell__hd">
                            <label class="weui-label">花费时间<span class="mulanbay-notNull">*</span></label>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="number" name="minutes" placeholder="单位：分钟">
                        </div>
                    </div>
                    <div class="weui-cells__title"><span class='mulanbay_textarea_title'>备注</span></div>
                    <div class="weui-cells weui-cells_form">
                        <div class="weui-cell">
                            <div class="weui-cell__bd">
                                <textarea class="weui-textarea" placeholder="" rows="3" name="remark"></textarea>
                                <div class="weui-textarea-counter"><span>0</span>/200</div>
                            </div>
                        </div>
                    </div>
                    <input type="text" style="display:none;" name='id' id="rrdId" value=""/>
                    <input type="text" style="display:none;" name='readingRecordId' id="detailReadingRecordId" value=""/>
                </form>
            </div>
            <br>
            <br>
            <a href="javascript:saveReadingRecordDetailData();" class="weui-btn weui-btn_primary weui-footer_fixed-bottom"><label>保存</label></a>
        </div>
    </div>
</div>

<br>
<a href="javascript:showAdd();" class="weui-btn weui-btn_primary weui-footer_fixed-bottom">新增</a>
<script type="text/javascript" src="../../static/include/footer-js.js"></script>
<script>
    $(function() {
        pushRefresh(getData);
        datePicker("storeDate");
        datePicker("proposedDate");
        datePicker("beginDate");
        datePicker("finishedDate");
        datetimePicker('readTime',null);
        $('#readTime').val(getNowDateTimeString());
        getData();
        pushStateListener();
    });
    function loadBookCategoryList(async){
        var url='/bookCategory/getBookCategoryTree';
        loadSelectListNormal(url,'bookCategoryList','bookCategoryId','bookCategoryId',true,async,null);
    }
    //阅读详情
    function showAddReadingRecordDetail(id) {
        $.openPopup('#edit-readingRecordDetail-popup') ;
        $('#detailReadingRecordId').val(id);
    }
    function saveReadingRecordDetailData() {
        var postData = form2Json("edit-readingRecordDetail-form");
        var url='/readingRecordDetail/create';
        doFormSubmit(postData,url,function(data){
            $.closePopup('#edit-readingRecordDetail-popup') ;
        });
    }
    function showAdd() {
        $.openPopup('#edit-popup') ;
        initForm(true,true);
        clearForm("edit-form");
        var formData = {
            status: 'UNREAD',
            language:'CHINESE',
            bookType:'PAPER'
        };
        $('#edit-form').loadJson(formData);
        setElementInnerHTML('edit-button-name','增加');
    }
    function showEdit(id) {
        var url='/readingRecord/get?id='+ id;
        doAjax(null,url,'GET',false,function(data){
            $.openPopup('#edit-popup') ;
            clearForm("edit-form");
            initForm(false,false);
            data.bookCategoryId=data.bookCategory.id;
            $('#edit-form').loadJson(data);
        });
        setElementInnerHTML('edit-button-name','修改');
    }
    function initForm(selectFirst,async) {
        loadBookCategoryList(async);
    }
    function loadReadingRecordTypeList(selectFirst,async){
        var url='/readingRecordType/getReadingRecordTypeTree';
        loadSelectList(url,'readingRecordTypeList','readingRecordTypeId','请选择类型',selectFirst,async,function (ov,nv) {
            loadreadingRecordType(nv);
        },null);
    }
    function loadreadingRecordType(id) {
        if(id==null||id==''){
            return;
        }
        if($('#readingRecordTypeId').val()==id){
            //return;
        }
        var url='/readingRecordType/get?id='+ id;
        doAjax(null,url,'GET',false,function(data) {
            $('#name').val(data.name);
            setElementInnerHTML('unitName',data.unit);
        });
    }
    function saveData() {
        var postData = form2Json("edit-form");
        var create=false;
        var url='/readingRecord/edit';
        if($("#id").val()==null||$("#id").val()==''){
            url='/readingRecord/create';
            create=true;
        }
        doFormSubmit(postData,url,function(data){
            $.closePopup('#edit-popup') ;
            if(create){
                getData();
                gotoTop();
            }else {
                var hh = createRow(data);
                setElementInnerHTML(getDivId(data.id),hh);
            }
        });
    }
    function showDelete(id) {
        var delUrlPrefix = '/readingRecord/delete';
        commonDeleteByIds(delUrlPrefix,id,function () {
            //searchData();
            //直接把该节点删除
            setElementInnerHTML(getDivId(id),'');
        });
    }
    function showDetailList(id) {
        window.location.href='readingRecordDetail.html?readingRecordId='+id;
    }
    function searchData() {
        setPage(1);
        getData();
    }
    function getData() {
        var url = '/readingRecord/getData';
        loadListData('search-form','dataContent','page',url,createRow,null);
    }
    function getDivId(id) {
        return 'readingRecord'+id;
    }
    function createRow(rowData) {
        var html='';
        html+='<div id="'+getDivId(rowData.id)+'">';
        html+='<div class="weui-form-preview">';
        html+='    <a class="weui-cell  weui-cell_access weui-cell_example" href="javascript:showEdit('+rowData.id+');">\n';
        var pic = '<img src="../../static/image/book.png">';
        html+='        <div class="weui-cell__hd">'+pic+'</div>\n';
        html+='        <div class="weui-cell__bd">\n';
        html+='<label class="weui-form-preview__label">'+rowData.bookCategory.name+'</label>';
        html+='        </div>\n';
        var st = rowData.statusName;
        if (rowData.status =='READED') {
            st = '<font color="green">'+st+'</font>';
        }else if (rowData.status =='UNREAD') {
            st = '<font color="red">'+st+'</font>';
        }else if (rowData.status =='READING') {
            st = '<font color="purple">'+st+'</font>';
        }else {
            st = '<font color="gray">'+st+'</font>';
        }
        html+='        <div class="weui-cell__ft">'+st+'</div>\n';
        html+='    </a>\n';
        html+='    <div class="weui-form-preview__bd">\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">作者</label>\n';
        html+='            <span class="weui-form-preview__value">'+rowData.author+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">国家</label>\n';
        html+='            <span class="weui-form-preview__value">'+rowData.nation+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">书名</label>\n';
        html+='            <span class="weui-form-preview__value mulanbay-dark-font">'+rowData.bookName+'</span>\n';
        html+='        </div>\n';
        html+='        <div class="weui-form-preview__item">\n';
        html+='            <label class="weui-form-preview__label">借入/购买日期</label>\n';
        var ss ='--'
        if(rowData.storeDate){
            ss=rowData.storeDate;
        }
        html+='            <span class="weui-form-preview__value">'+ss+'</span>\n';
        html+='        </div>\n';
        if(rowData.finishedDate){
            html+='        <div class="weui-form-preview__item">\n';
            html+='            <label class="weui-form-preview__label">开始日期</label>\n';
            html+='            <span class="weui-form-preview__value">'+rowData.beginDate+'</span>\n';
            html+='        </div>\n';
            html+='        <div class="weui-form-preview__item">\n';
            html+='            <label class="weui-form-preview__label">完成日期</label>\n';
            html+='            <span class="weui-form-preview__value">'+rowData.finishedDate+'</span>\n';
            html+='        </div>\n';
            html+='        <div class="weui-form-preview__item">\n';
            html+='            <label class="weui-form-preview__label">完成时长</label>\n';
            var costDays = rowData.costDays;
            var cd ='--';
            if (costDays >30) {
                cd = '<font color="red">'+formatDays(costDays)+'</font>';
            }else {
                cd = formatDays(costDays);
            }
            html+='            <span class="weui-form-preview__value">'+cd+'</span>\n';
            html+='        </div>\n';
        }
        html+='    </div>\n';
        html+='    <div class="weui-form-preview__ft">\n';
        html+='        <a class="weui-form-preview__btn weui-form-preview__btn" href="javascript:showAddReadingRecordDetail('+rowData.id+');">新增阅读</a>\n';
        html+='        <a class="weui-form-preview__btn weui-form-preview__btn" href="javascript:showDetailList('+rowData.id+');">阅读记录</a>\n';
        html+='        <a class="weui-form-preview__btn weui-form-preview__btn_delete" href="javascript:showDelete('+rowData.id+');">删除</a>\n';
        html+='    </div>\n';
        html+='</div>\n';
        html+='</div>\n';
        html+='<br>\n';
        return html;
    }
</script>
</body>
</html>